<template>
    <div>
        <!-- 头部 -->
        <!-- <div class="top_tab1">
            <div class="left1" @click="back()">
                <img  src="../assets/order_center/shangs.png">
            </div>
            <span>解债师证书查询</span>
            <div class="right1">
            </div>
        </div>
        <div class="n"></div> -->
        <div class="soluinquire">
            <div class="solunumber">证书编号
                <input class="soluinput" type="text" v-model="booknum" placeholder="请输入证书编号">
            </div>
            <div class="solubtn" @click="chaxun()">确认</div>
        </div>
        <yd-popup v-model="show" position="center" width="90%">
            <div class="solutab1" style="background-color:#fff;">
                <div class="soluqur">提示</div>
                <div class="solutishi">没有查询到该证书编号，请谨防上当受骗；您可以拨打我们的联系电话举报持证人！</div>
                <div class="soluqueren" @click="show = false">确定</div>
            </div>
        </yd-popup>
        <yd-popup v-model="showq" position="center" width="90%">
            <div class="solutab1" style="background-color:#fff;">
                <div class="soluqur">解债师信息如下</div>
                <div class="solutishi">解债师姓名：{{datas.name}}</div>
                <div class="solutishi">电话：{{datas.phone}}</div>
                <div class="soluqueren" @click="showq = false">确定</div>
            </div>
        </yd-popup>
    </div>
</template>
<script>
import Vue from 'vue';
import {Popup} from 'vue-ydui/dist/lib.rem/popup';
Vue.component(Popup.name, Popup);


export default {
  name: "solution",
  data() {
    return {
      show: false,
      showq: false,
      spinner: 1,
      booknum:'',
      datas:[]
    };
  },
  methods: {
    back: function() {
      this.$router.go(-1);
    },
      //查询
    chaxun(){
      let self = this;
      let url = "/api/explain_cha"; 
      if(!this.booknum){
        this.$dialog.toast({
            mes: '请输入证书编号！',
            timeout: 1500
        });
        return
      }
			self.httpPost(url,{user_id:this.user_id,token:this.token,booknum:this.booknum},function(res) {
				if (res.code == 200) {   
          self.showq = true;

          self.datas = res.data
					//  self.$dialog.toast({
          //       mes: res.msg,
          //       timeout: 1000,
          //       icon: 'success'
          //   });
            // setTimeout(() => {
            //     self.back();
            // }, 1500);
				}else{
          self.show = true; 
				} 
      })
    }
  },
     created(){
      document.title = "解债师证书查询";  
      this.user_id = localStorage.getItem('myid');
      this.token = localStorage.getItem('mytoken');
    } 
};
</script>
<style>
.top_tab1 {
  width: 100%;
  padding: 0.2rem 0.3rem;
  background: #fff;
  position: fixed;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0.01rem 0.01rem 0.06rem #ddd;
}
.top_tab1 span {
  color: #333;
  font-size: 0.36rem;
  padding-left: 0.8rem;
}
.top_tab1 .right1 {
  width: 1rem;
  display: flex;
  justify-content: space-between;
}
.top_tab1 img {
  width: 0.43rem;
}
.n {
  height: 0.9rem;
}
.soluinquire{
    height:3.12rem;
    margin:.1rem;
    background:#fff;
    border-radius: .4rem;
}
.solunumber{
    width:90%;
    margin:0 auto;
    font-size:.32rem;
    padding:.6rem 0 .4rem;
    border-bottom:1px solid #ddd;
}
.soluinput{
    border:none;
    margin-left:.3rem;
}
.solubtn{
    width:1.8rem;
    height:.8rem;
    font-size:.35rem;
    text-align: center;
    line-height:.8rem;
    background:#E63F3F;
    color:#fff;
    border-radius: .15rem;
    margin:.4rem auto;
}
.solutab1 {
  border-radius: 0.4rem;
}
.soluqur {
  width: 80%;
  margin: 0 auto;
  padding-top: 0.6rem;
  font-size: 0.3rem;
  text-align: center;
}
.solutishi {
  width: 80%;
  margin: 0.4rem auto;
  font-size: 0.3rem;
  color: #999;
  line-height: 1.5;
}
.soluqueren {
  height: 0.9rem;
  line-height: 0.9rem;
  font-size: 0.3rem;
  border-top: 1px solid #999;
  text-align: center;
}
</style>

